<template>
	<view class="center">
		<view class="raw">
			<text>原密码</text>
			<input type="text" v-model="rawpassword" value="" placeholder="请输入原密码" />
		</view>
		<view class="raw">
			<text>新密码</text>
			<input type="text" v-model="newpassword" value="" placeholder="请输入新密码" />
		</view>
		<view class="raw">
			<text>确认新密码</text>
			<input type="text" v-model="confimpassword" value="" placeholder="请输入新密码" />
		</view>
		<view class="btn" @tap='btn'>
			确定
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				//原密码
				rawpassword:'',
				//新密码
				newpassword:'',
				//确认
				confimpassword:''
			}
		},
		methods: {
			
			btn(){
				if( !this.rawpassword ){
					this.$sToast('密码不能为空')
					return;
				}else if( !/^[a-zA-Z0-9]{6,10}$/.test(this.newpassword) ){
					this.$sToast('密码最少6位字符')
					return;
				}else if(!(this.newpassword == this.confimpassword)){
						this.$sToast('两次密码输入不一样')
					return;
				}else{
				this.$ajax(
				this.apiList.password,
				{
					oldpassword:this.rawpassword,
					newpassword:this.newpassword,
					newpassword1:this.confimpassword
				},'POST'
				).then(res=>{
					this.$sToast(res.msg)
				})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.center{
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	box-sizing: border-box;
	background-color: #eee;
	padding:30upx 0upx;
	.raw{
		width: 100%;
		display: flex;
		align-items: center;
		background: #fff;
		padding: 20upx;
		box-sizing: border-box;
		border-bottom: 1upx solid #e0e0e0;
		text{
			font-size:28upx;
			font-family:PingFang SC;
			font-weight:400;
			flex: 1;
		}
		input{
			font-size:28upx;
			font-family:PingFang SC;
			font-weight:400;
			text-align: right;
		}
		}
		.btn{
			width: 100%;
			height: 77upx;
			background: rgba(139, 221, 142, 1);
			box-sizing: border-box;
			font-size:32upx;
			font-family:PingFang SC;
			font-weight:400;
			color:#fff;
			text-align: center;
			line-height: 77upx;
			position: fixed;
			left: 0;
			bottom: 0;
		}
}
</style>
